import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_icons/flutter_icons.dart';
import 'package:flutter_svg/svg.dart';
import 'package:karyo/karyo.dart';
import 'package:karyo/src/login/Signup/signup_screen.dart';
import 'package:karyo/src/login/bloc/login_bloc.dart';
import 'package:karyo/src/login/components/already_have_an_account_acheck.dart';
import 'package:karyo/src/login/components/rounded_button.dart';
import 'package:karyo/src/login/components/rounded_input_field.dart';
import 'package:karyo/src/login/components/rounded_password_field.dart';
import 'package:modal_bottom_sheet/modal_bottom_sheet.dart';
import 'background.dart';

class LoginScreen extends StatefulWidget {
  LoginScreen({Key key, this.onLoginCallBack}) : super(key: key);

  final Function onLoginCallBack;

  @override
  _LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
  TextEditingController _nameController = new TextEditingController();
  TextEditingController _pwdController = new TextEditingController();

  void _login(bloc, name, pwd, context) async {
    var res =
        await bloc.login(_nameController.text, _pwdController.text, context);
    if (res) {
      widget.onLoginCallBack(context);
    }
    
  }

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    LoginBloc loginBloc = BlocProvider.of(context);
    // LoginBloc loginBloc = LoginBloc();

    return AnnotatedRegion<SystemUiOverlayStyle>(
        value: SystemUiOverlayStyle(
          // statusBarColor: Colors.transparent,
          // statusBarColor: Theme.of(context).dialogBackgroundColor,
          // systemNavigationBarColor: Theme.of(context).scaffoldBackgroundColor,
          systemNavigationBarColor: Colors.transparent,
        ),
        child: Scaffold(
            extendBody: true,
            body: Stack(children: [
              Background(
                child: SingleChildScrollView(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      Text(
                        "欢迎回到你的小宇宙",
                        style: NORMAL_BOLD_TXT_STYLE.copyWith(
                            color: COLOR_PRIMARY, fontSize: 28),
                      ),
                      SizedBox(height: size.height * 0.03),
                      SvgPicture.asset(
                        "assets/illustrations/undraw_My_universe_re_txot.svg",
                        height: size.height * 0.25,
                      ),
                      SizedBox(height: size.height * 0.03),
                      RoundedInputField(
                        hintText: "手机号/微信号",
                        onChanged: (value) {},
                        controller: _nameController,
                      ),
                      RoundedPasswordField(
                        onChanged: (value) {},
                        controller: _pwdController,
                      ),
                      SizedBox(height: size.height * 0.03),
                      RoundedButton(
                        color: COLOR_PRIMARY,
                        text: "登录",
                        press: () {
                          _login(loginBloc, _nameController.text,
                              _pwdController.text, context);
                        },
                      ),
                      SizedBox(height: size.height * 0.03),
                      AlreadyHaveAnAccountCheck(
                        press: () {
                          showCupertinoModalBottomSheet(
                            context: context,
                            builder: (context) => BlocProvider(
                                child: SignUpScreen(), bloc: loginBloc),
                          );
                        },
                      ),
                    ],
                  ),
                ),
              ),
              Positioned(
                left: 16,
                top: 38,
                child: buildBackButton(context, COLOR_PRIMARY),
              ),
            ])));
  }
}
